import 'package:flutter/material.dart';

class DrawerDemo extends StatefulWidget {
  DrawerDemo({Key key}) : super(key: key);

  _DrawerDemoState createState() => _DrawerDemoState();
}

class _DrawerDemoState extends State<DrawerDemo> {
  List<String> _tags = ['html', 'css', 'js', 'java', 'flutter'];

  String _chioce = 'lemon';
  @override
  Widget build(BuildContext context) {
    final keys = GlobalKey<ScaffoldState>();
    return Scaffold(
      key: keys,
      appBar: AppBar(
        title: Text('DrawerDemo'),
        actions: <Widget>[
          new IconButton(
              icon: new Icon(Icons.border_clear),
              onPressed: () {
                keys.currentState.openEndDrawer();
                // keys.currentState.openDrawer();
              })
        ],
      ),
      body: Center(
        child: Container(
          child: new IconButton(
              icon: new Icon(Icons.border_clear),
              onPressed: () {
                keys.currentState.openEndDrawer();
                // keys.currentState.openDrawer();
              }),
        ),
      ),
      // endDrawer 表示从右边打开抽屉
      // drawer表示从左边打开抽屉
      endDrawer: Drawer(
        child: ListView(
          padding: EdgeInsets.zero,
          children: <Widget>[
            UserAccountsDrawerHeader(
              accountName: Text('zhushukun',
                  style: TextStyle(fontWeight: FontWeight.bold)),
              accountEmail: Text('18618324939@163.com'),
              currentAccountPicture: CircleAvatar(
                backgroundImage: NetworkImage(
                    'http://pic108.huitu.com/res/20180719/1649475_20180719145952642070_1.jpg'),
              ),
              decoration: BoxDecoration(
                color: Colors.yellowAccent,
                image: DecorationImage(
                  image: NetworkImage(
                      'http://hbimg.b0.upaiyun.com/2e7dde4b38993c386fc05a184080479551dc79922d4e4-zjEfU6_fw658'),
                  fit: BoxFit.cover,
                  colorFilter: ColorFilter.mode(
                      Colors.yellow[400].withOpacity(0.6), BlendMode.srcOver),
                ),
              ),
            ),
            DrawerHeader(
              child: Text('Hearder'.toUpperCase()),
              decoration: BoxDecoration(
                color: Colors.grey[100],
              ),
            ),
            ListTile(
              title: Text(
                'messages',
                textAlign: TextAlign.right,
              ),
              trailing: Icon(
                Icons.message,
                color: Colors.black12,
                size: 22.0,
              ),
              onTap: () {
                Navigator.pop(context);
              },
            ),
            Wrap(
              spacing: 8.0,
              children: _tags.map((tag) {
                return ChoiceChip(
                  label: Text(
                    tag,
                    style: TextStyle(
                      color: _chioce == tag ? Colors.white : Colors.black,
                    ),
                  ),
                  selectedColor: Colors.red,
                  selected: _chioce == tag,
                  onSelected: (v) {
                    setState(() {
                      _chioce = tag;
                    });
                  },
                );
              }).toList(),
            ),
            ListTile(
              title: Text(
                'favorite',
                textAlign: TextAlign.right,
              ),
              trailing: Icon(
                Icons.favorite,
                color: Colors.black12,
                size: 22.0,
              ),
              onTap: () {
                Navigator.pop(context);
              },
            ),
            ListTile(
              title: Text(
                'settings',
                textAlign: TextAlign.right,
              ),
              trailing: Icon(
                Icons.settings,
                color: Colors.black12,
                size: 22.0,
              ),
              onTap: () {
                Navigator.pop(context);
              },
            ),
          ],
        ),
      ),
    );
  }
}
